<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ page import="bean.User"%>
<%@ page import="bean.Right"%>
<%@ page import="java.util.List"%>
<%@ page import="bean.model.PageModel"%>
<%
	User user = (User) request.getSession().getAttribute("user");
	List<Right> type1 = (List) request.getSession().getAttribute("type1");
	List<Right> type2 = (List) request.getSession().getAttribute("type2");
	List<Right> type3 = (List) request.getSession().getAttribute("type3");
	List<Right> type4 = (List) request.getSession().getAttribute("type4");
	List<User> queryStaffByPage = (List) request.getSession().getAttribute("sss");
	PageModel pageModel = (PageModel) request.getSession().getAttribute("staffPageModel");
%>
<!DOCTYPE html>
<!--[if IE 9 ]><html class="ie9"><![endif]-->
<head>
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<meta name="format-detection" content="telephone=no">
<meta charset="UTF-8">

<meta name="description" content="Violate Responsive Admin Template">
<meta name="keywords" content="Super Admin, Admin, Template, Bootstrap">

<title>车辆缉查管理系统-人员管理查询</title>

<!-- CSS -->
<link href="zhu/css/bootstrap.min.css" rel="stylesheet">
<link href="zhu/css/animate.min.css" rel="stylesheet">
<link href="zhu/css/font-awesome.min.css" rel="stylesheet">
<link href="zhu/css/form.css" rel="stylesheet">
<link href="zhu/css/calendar.css" rel="stylesheet">
<link href="zhu/css/style.css" rel="stylesheet">
<link href="zhu/css/icons.css" rel="stylesheet">
<link href="zhu/css/generics.css" rel="stylesheet">
<!-- 我自己网上找的 -->
<link
	href="https://cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.min.css"
	rel="stylesheet">
<link rel="stylesheet" type="text/css"
	href="css/bootstrap-datepicker3.min.css">

</head>
<body id="skin-blur-violate">

	<header id="header" class="media">
		<a href="" id="menu-toggle"></a> <a class="logo pull-left"
			href="toIndex">车辆缉查管理</a>

		<div class="media-body">
			<div class="media" id="top-menu">



				<div id="time" class="pull-right">
					<span id="hours"></span> : <span id="min"></span> : <span id="sec"></span>
				</div>

			</div>
		</div>
	</header>

	<div class="clearfix"></div>

	<section id="main" class="p-relative" role="main">

		<!-- Sidebar -->
		<aside id="sidebar">

			<!-- Sidbar Widgets -->
			<div class="side-widgets overflow">
				<!-- Profile Menu -->
				<div class="text-center s-widget m-b-25 dropdown" id="profile-menu">
					<a href="toIndex" data-toggle="dropdown"> <img
						class="profile-pic animated" src="zhu/img/profile-pic.jpg" alt="">
					</a>
					<ul class="dropdown-menu profile-menu">
						<li><a href="logout">注销用户</a> <i class="icon left">&#61903;</i><i
							class="icon right">&#61815;</i></li>
					</ul>
					<h4 class="m-0"><%=user.getUserName()%></h4>

				</div>

				<!-- Calendar -->
				<div class="s-widget m-b-25">
					<div id="sidebar-calendar"></div>
				</div>


				<!-- Projects -->


				<div class="s-widget-body"></div>
			</div>
			</div>

			<!-- Side Menu -->
			<ul class="list-unstyled side-menu">
				<li class="active"><a class="sa-side-home" href="toIndex">
						<span class="menu-item">主页</span>
				</a></li>
				<%
					if (!type1.isEmpty()) {
				%>

				<li class="dropdown"><a class="sa-side-ui" href=""> <span
						class="menu-item">卡口系统</span>
				</a>
					<ul class="list-unstyled menu-item">
						<%
							for (Right right : type1) {
						%>
						<li><a href="<%=right.getHref()%>" onclick="loading()"><%=right.getRightName()%></a></li>
						<%
							}
						%>
					</ul></li>
				<li>
					<%
						}
						if (!type2.isEmpty()) {
					%>
				
				<li class="dropdown"><a class="sa-side-widget" href=""> <span
						class="menu-item">车辆缉查</span>
				</a>
					<ul class="list-unstyled menu-item">
						<%
							for (Right right : type2) {
						%>
						<li><a href="<%=right.getHref()%>" onclick="loading()"><%=right.getRightName()%></a></li>
						<%
							}
						%>
					</ul></li>
				<li>
					<%
						}
						if (!type3.isEmpty()) {
					%>
				
				<li class="dropdown"><a class="sa-side-form" href=""> <span
						class="menu-item">资源管理</span>
				</a>
					<ul class="list-unstyled menu-item">
						<%
							for (Right right : type3) {
						%>
						<li><a href="<%=right.getHref()%>" onclick="loading()"><%=right.getRightName()%></a></li>
						<%
							}
						%>
					</ul></li>
				<%
					}
					if (!type4.isEmpty()) {
				%>
				<li class="dropdown"><a class="sa-side-ui" href=""> <span
						class="menu-item">系统管理</span>
				</a>
					<ul class="list-unstyled menu-item">
						<%
							for (Right right : type4) {
						%>
						<li><a href="<%=right.getHref()%>" onclick="loading()"><%=right.getRightName()%></a></li>
						<%
							}
						%>
					</ul> <%
 	}
 %></li>
			</ul>
		</aside>

		<!-- Content -->
		<section id="content" class="container">


			<!-- Notification Drawer -->
			<div id="notifications" class="tile drawer animated">
				<div class="listview narrow">
					<div class="media">
						<a href="">Notification Settings</a> <span class="drawer-close">&times;</span>
					</div>
					<div class="overflow" style="height: 254px">
						<div class="media">
							<div class="pull-left">
								<img width="40" src="zhu/img/profile-pics/1.jpg" alt="">
							</div>
							<div class="media-body">
								<small class="text-muted">Nadin Jackson - 2 Hours ago</small><br>
								<a class="t-overflow" href="">Mauris consectetur urna nec
									tempor adipiscing. Proin sit amet nisi ligula. Sed eu
									adipiscing lectus</a>
							</div>
						</div>
						<div class="media">
							<div class="pull-left">
								<img width="40" src="zhu/img/profile-pics/2.jpg" alt="">
							</div>
							<div class="media-body">
								<small class="text-muted">David Villa - 5 Hours ago</small><br>
								<a class="t-overflow" href="">Suspendisse in purus ut nibh
									placerat Cras pulvinar euismod nunc quis gravida. Suspendisse
									pharetra</a>
							</div>
						</div>
						<div class="media">
							<div class="pull-left">
								<img width="40" src="zhu/img/profile-pics/3.jpg" alt="">
							</div>
							<div class="media-body">
								<small class="text-muted">Harris worgon - On 15/12/2013</small><br>
								<a class="t-overflow" href="">Maecenas venenatis enim
									condimentum ultrices fringilla. Nulla eget libero rhoncus,
									bibendum diam eleifend, vulputate mi. Fusce non nibh pulvinar,
									ornare turpis id</a>
							</div>
						</div>
						<div class="media">
							<div class="pull-left">
								<img width="40" src="zhu/img/profile-pics/4.jpg" alt="">
							</div>
							<div class="media-body">
								<small class="text-muted">Mitch Bradberry - On
									14/12/2013</small><br> <a class="t-overflow" href="">Phasellus
									interdum felis enim, eu bibendum ipsum tristique vitae.
									Phasellus feugiat massa orci, sed viverra felis aliquet quis.
									Curabitur vel blandit odio. Vestibulum sagittis quis sem sit
									amet tristique.</a>
							</div>
						</div>
						<div class="media">
							<div class="pull-left">
								<img width="40" src="zhu/img/profile-pics/1.jpg" alt="">
							</div>
							<div class="media-body">
								<small class="text-muted">Nadin Jackson - On 15/12/2013</small><br>
								<a class="t-overflow" href="">Ipsum wintoo consectetur urna
									nec tempor adipiscing. Proin sit amet nisi ligula. Sed eu
									adipiscing lectus</a>
							</div>
						</div>
						<div class="media">
							<div class="pull-left">
								<img width="40" src="zhu/img/profile-pics/2.jpg" alt="">
							</div>
							<div class="media-body">
								<small class="text-muted">David Villa - On 16/12/2013</small><br>
								<a class="t-overflow" href="">Suspendisse in purus ut nibh
									placerat Cras pulvinar euismod nunc quis gravida. Suspendisse
									pharetra</a>
							</div>
						</div>
					</div>
					<div class="media text-center whiter l-100">
						<a href=""><small>VIEW ALL</small></a>
					</div>
				</div>
			</div>

			<!-- Breadcrumb -->
			<ol class="breadcrumb hidden-xs">

				<li class="active"><a href="toIndex">主页</a></li>
				<li><a href="logout">注销用户</a></li>
			</ol>

			<h4 class="page-title">人员管理</h4>


			<div class="tile">
				<h2 class="tile-title">信息查询</h2>


				<form class="form-inline" role="form">
					<div class="form-group">
						<label class="form-label">用户名</label> <input type="text"
							name="userName"
							class="form-control contact_input_box wow fadeInUp" id="userName">
					</div>
					<div>
						<input type="checkbox" id="check" onclick="ambigurous_query">模糊查询</input>
					</div>
				</form>
				<input type="text"
					style="visibility: hidden; width: 20px; height: 20px;"
					name="我是用来占位置的" />
				<form class="form-inline" role="form">
					<div class="form-group">
						<label class="form-label">性别</label>
						<div class="form-group">
							<div class="col-sm-4">
								<select id="sex" name="sex"
									class="selectpicker show-tick form-control"
									data-live-search="false">
									<option value="0">全部 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</option>
									<option value="1">男 &nbsp;</option>
									<option value="2">女&nbsp;</option>
								</select>
							</div>
						</div>
						<label class="form-label">年龄范围</label>
						<div class="form-group">
							<input type="text" name="ageFrom"
								class="form-control contact_input_box wow fadeInUp" id="ageFrom"
								placeholder="不限制"> <label class="form-label">至</label> <input
								type="text" name="ageTo"
								class="form-control contact_input_box wow fadeInUp" id="ageTo"
								placeholder="不限制">
						</div>
					</div>
					<button type="button"
						class="btn btn-primary contact_button wow fadeInUp"
						onclick='query()'>
						<i class="fa fa-send-o"></i> 查询
					</button>
					<button type="button"
						class="btn btn-primary contact_button wow fadeInUp"
						onclick='add()'>
						<i class="fa fa-send-o"></i> 增加
					</button>
					<button class="btn btn-primary contact_button wow fadeInUp">
						<a href="toIndex"><i class="fa fa-send-o"></i> 返回</a>
					</button>

				</form>


			</div>
			<!-- Table Hover -->
			<div class="block-area" id="tableHover">

				<div class="table-responsive overflow">
					<form class="form-inline" role="form">
				<h2 class="tile-title">
					<a id="btn0"></a> 当前
					<%=pageModel.getCurrentPage()%>/
					<%=pageModel.getTotalPage()%>页 每页<input id="pageSize" type="text"
						size="1" maxlength="2" value="<%=pageModel.getEveryPage()%>"
						class="form-control contact_input_box wow fadeInUp"
						style="width: 50px;" /> 条 <a href="#" id="pageSizeSet">设置</a> <a
						id="sjzl">数据总量 <%=pageModel.getTotalCount()%></a> <a href="#"
						id="btn1">首页</a> <a href="#" id="btn2">上一页</a> <a href="#"
						id="btn3">下一页</a> <a href="#" id="btn4">尾页</a> <a>转到 </a> <input
						id="changePage" type="text" size="1" maxlength="4"
						class="form-control contact_input_box wow fadeInUp"
						style="width: 50px;" /> <a>页 </a> <a href="#" id="btn5">跳转</a>
				</h2>
			</form>


					<table id="optionContainer" data-toggle="table"
						class="table table-bordered table-hover tile"
						data-url="${ctxAdmin}/user/userData?orgId=${orgId}"
						//table数据来源，json格式 data-pagination="true" //是否支持分页
						data-show-search="true" //是否显示搜索框功能 data-show-columns="true"
						//显示columns功能按钮 data-icon-size="outline"
						data-mobile-responsive="true" data-height="500" id="tablelist"
						data-side-pagination="server" //支持服务器端分页，默认是client>


						<thead>
							<tr>
								<th>用户名</th>
								<th>性别</th>
								<th>生日</th>
								<th>联系方式</th>
								<th>角色</th>
								<th>真实姓名</th>
								<th data-formatter="actionFormatter" data-events="actionEvents">操作</th>
							</tr>
						<tbody>
							<%
								for (User staff : queryStaffByPage) {
							%>
							<tr>

								<td><%=staff.getUserName()%></td>
								<td><%=staff.getSex()%></td>
								<td><%=staff.getBirthday()%></td>
								<td><%=staff.getPhoneNumber()%></td>
								<%
									if (staff.getRole().getRoleId() == 2) {
								%>
								<td>警官</td>
								<%
									} else if (staff.getRole().getRoleId() == 1) {
								%>
								<td>警员</td>
								<%
									} else if (staff.getRole().getRoleId() == 3) {
								%>
								<td>管理员</td>
								<%
									}
								%>

								<td><%=staff.getTruename()%></td>
								<td>==</td>



							</tr>
							<%
								}
							%>

						</tbody>
					</table>
				</div>
			</div>




			<!-- dialog -->
			<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
				aria-labelledby="myModalLabel">
				<div class="modal-dialog" role="document">
					<div class="modal-content">
						<div class="modal-header">
							<button type="button" class="close" data-dismiss="modal"
								aria-label="Close">
								<span aria-hidden="true">×</span>
							</button>
							<h4 class="modal-title" id="myModalLabel">编辑</h4>
						</div>
						<div class="modal-body">

							<div class="form-group">
								<label for="edit_userName">用户名</label> <input type="text"
									name="edit_userName" class="form-control" id="edit_userName"
									placeholder="用户名">
							</div>
							<div class="edit_relName">
								<label for="edit_relName">真实姓名</label> <input type="text"
									name="edit_relName" class="form-control" id="edit_relName"
									placeholder="真实姓名">
							</div>
							<div class="form-group">
								<label for="edit_sex">性别</label> <input type="text"
									name="edit_sex" class="form-control" id="edit_sex"
									placeholder="性别">
							</div>
							<div class="form-group date datepicker">
								<label for="txt_statu">出生日期</label> <input type="text"
									name="edit_birthday" class="form-control" id="edit_birthday"
									placeholder="出生日期">
							</div>
							<div class="form-group">
								<label for="txt_statu">联系方式</label> <input type="text"
									name="edit_phoneNumber" class="form-control"
									id="edit_phoneNumber" placeholder="联系方式">
							</div>
						</div>
						<div class="modal-footer">
							<button type="button" class="btn btn-default"
								data-dismiss="modal">
								<span class="glyphicon glyphicon-remove" aria-hidden="true"></span>关闭
							</button>
							<button type="button"
								class="btn btn-primary contact_button wow fadeInUp"
								onclick='save()'>
								<span class="glyphicon glyphicon-floppy-disk" aria-hidden="true"></span>保存
							</button>
						</div>
					</div>
				</div>
			</div>

		</section>

		<!-- Older IE Message -->
		<!--[if lt IE 9]>
                <div class="ie-block">
                    <h1 class="Ops">Ooops!</h1>
                    <p>You are using an outdated version of Internet Explorer, upgrade to any of the following web browser in order to access the maximum functionality of this website. </p>
                    <ul class="browsers">
                        <li>
                            <a href="https://www.google.com/intl/en/chrome/browser/">
                                <img src="zhu/img/browsers/chrome.png" alt="">
                                <div>Google Chrome</div>
                            </a>
                        </li>
                        <li>
                            <a href="http://www.mozilla.org/en-US/firefox/new/">
                                <img src="zhu/img/browsers/firefox.png" alt="">
                                <div>Mozilla Firefox</div>
                            </a>
                        </li>
                        <li>
                            <a href="http://www.opera.com/computer/windows">
                                <img src="zhu/img/browsers/opera.png" alt="">
                                <div>Opera</div>
                            </a>
                        </li>
                        <li>
                            <a href="http://safari.en.softonic.com/">
                                <img src="zhu/img/browsers/safari.png" alt="">
                                <div>Safari</div>
                            </a>
                        </li>
                        <li>
                            <a href="http://windows.microsoft.com/en-us/internet-explorer/downloads/ie-10/worldwide-languages">
                                <img src="zhu/img/browsers/ie.png" alt="">
                                <div>Internet Explorer(New)</div>
                            </a>
                        </li>
                    </ul>
                    <p>Upgrade your browser for a Safer and Faster web experience. <br/>Thank you for your patience...</p>
                </div>   
            <![endif]-->
	</section>

	<!-- Javascript Libraries -->
	<!-- jQuery -->
	<script src="zhu/js/jquery.min.js"></script>
	<!-- jQuery Library -->
	<script src="zhu/js/jquery-ui.min.js"></script>
	<!-- jQuery UI -->
	<script src="zhu/js/jquery.easing.1.3.js"></script>
	<!-- jQuery Easing - Requirred for Lightbox + Pie Charts-->

	<!-- Bootstrap -->
	<script src="zhu/js/bootstrap.min.js"></script>

	<!-- Charts -->
	<script src="zhu/js/charts/jquery.flot.js"></script>
	<!-- Flot Main -->
	<script src="zhu/js/charts/jquery.flot.time.js"></script>
	<!-- Flot sub -->
	<script src="zhu/js/charts/jquery.flot.animator.min.js"></script>
	<!-- Flot sub -->
	<script src="zhu/js/charts/jquery.flot.resize.min.js"></script>
	<!-- Flot sub - for repaint when resizing the screen -->

	<script src="zhu/js/sparkline.min.js"></script>
	<!-- Sparkline - Tiny charts -->
	<script src="zhu/js/easypiechart.js"></script>
	<!-- EasyPieChart - Animated Pie Charts -->
	<script src="zhu/js/charts.js"></script>
	<!-- All the above chart related functions -->

	<!-- Map -->
	<script src="zhu/js/maps/jvectormap.min.js"></script>
	<!-- jVectorMap main library -->
	<script src="zhu/js/maps/usa.js"></script>
	<!-- USA Map for jVectorMap -->

	<!--  Form Related -->
	<script src="zhu/js/icheck.js"></script>
	<!-- Custom Checkbox + Radio -->

	<!-- UX -->
	<script src="zhu/js/scroll.min.js"></script>
	<!-- Custom Scrollbar -->

	<!-- Other -->
	<script src="zhu/js/calendar.min.js"></script>
	<!-- Calendar -->
	<script src="zhu/js/feeds.min.js"></script>
	<!-- News Feeds -->


	<!-- All JS functions -->
	<script src="zhu/js/functions.js"></script>

	<!--我自己网上找的js-->
	<script
		src="https://cdn.bootcss.com/bootstrap-table/1.11.1/locale/bootstrap-table-zh-CN.js"></script>
	<script
		src="https://cdn.bootcss.com/bootstrap-table/1.11.1/bootstrap-table.js"></script>
	<script
		src="https://cdn.bootcss.com/bootstrap-table/1.11.1/extensions/export/bootstrap-table-export.js"></script>
	<script src="js/layer.js"></script>
	<script type="text/javascript" src="js/bootstrap-datepicker.min.js"></script>
	<script type="text/javascript">
	
function actionFormatter(value, row, index) {
        return '<a class="mod" >查看详情</a> ' + '<a class="delete">删除</a>';
    }

    //value: 所在collumn的当前显示值，
    //row:整个行的数据 ，对象化，可通过.获取
     //表格-操作 - 格式化 
    
    //表格  - 操作 - 事件
    window.actionEvents = {
        'click .mod': function(e, value, row, index) {      
        	$.ajax({
        		url : "staffManagerInformation",
        		type : "post",
        		data : {
        			
        		},
        		success:function onSuccess(data){				
					location.href="staffManagerInformation";
					}});
            },
        'click .delete' : function(e, value, row, index) {
        	var tableId = document.getElementById("tablelist");
			var deleteName = tableId.rows[index+1].cells[0].innerHTML;
			$.ajax({
        		url : "staffManagerDelete",
        		type : "post",
        		data : {
        			deleteName : deleteName	
        		},success:function onSuccess(data){				
        			
				}
            });	
			tableId.rows[index+1].remove();
        }
    }

  function add() {
$("#myModalLabel").text("新增");
$('#myModal').modal();
};
function save() {
	var name = document.getElementById("edit_userName");
	var realName = document.getElementById("edit_relName");
	var sex = document.getElementById("edit_sex");
	var	birthday = document.getElementById("edit_birthday");
	var phoneNumber = document.getElementById("edit_phoneNumber");
	$.ajax({
		url : "staffManagerInsert",
		type : "post",
		data : {
			username : name.value,
			userRealName :realName.value,
			userSex :sex.value,
			userBirthday :birthday.value,
			userPhoneNumber :phoneNumber.value
		}});
	alert("保存成功");
    var newRow='<tr><td>'+name.value+'</td><td>'+sex.value+'</td><td>'+birthday.value+'</td><td>'+phoneNumber.value+'</td><td>警员</td><td>'+realName.value+'</td><td>==</td>';  
    $('#optionContainer').prepend(newRow);  
    $('#myModal').modal('hide');
};
function query() {
	var name = document.getElementById("userName");
	var sex = document.getElementById("sex");
	var ageFrom = document.getElementById("ageFrom");
	var ageTo = document.getElementById("ageTo");
	var chk=document.getElementById("check");//用来获取模糊查询的选中状态    通过chk.checked是true还是false
	$.ajax({
		url : "staffManagerSearch",
		type : "post",
		data : {
			userName : name.value,
			sex : sex.value,
			ageFrom : ageFrom.value,
			ageTo : ageTo.value,
			chk : chk.checked
		},
		success: function(returnedData){
	        alert(returnedData[0].sex);
		}
	});
};
</script>



	<script type="text/javascript">
            var pageSize = 15;    //每页显示的记录条数
             var curPage=0;        //当前页
             var lastPage;        //最后页
             var direct=0;        //方向
            var len;            //总行数
            var page;            //总页数
            var begin;
            var end;

                
            $(document).ready(function display(){   
                len =$("#mytable").length - 1;    // 求这个表的总行数，剔除第一行介绍
                page=len % pageSize==0 ? len/pageSize : Math.floor(len/pageSize)+1;//根据记录条数，计算页数
                // alert("page==="+page);
                curPage=1;    // 设置当前为第一页
                displayPage(1);//显示第一页

                document.getElementById("btn0").innerHTML="当前 " + curPage + "/" + page + " 页    每页 ";    // 显示当前多少页
                document.getElementById("sjzl").innerHTML="数据总量 " + len + "";        // 显示数据量
                document.getElementById("pageSize").value = pageSize;

                $("#btn1").click(function firstPage(){    // 首页
                    curPage=1;
                    direct = 0;
                    $.ajax({
                		url : "staffManagerFirstPage",
                		type : "post",
                		data : {
                			staffPageSize : pageSize
                		}});
                    displayPage();
                });
                $("#btn2").click(function frontPage(){    // 上一页
                    direct=-1;
                    $.ajax({
                		url : "staffManagerPrePage",
                		type : "post",
                		data : {
                			staffPageSize : pageSize,
                			staffCurPage : curPage
                		}});
                    displayPage();
                });
                $("#btn3").click(function nextPage(){    // 下一页
                    direct=1;
                    $.ajax({
                		url : "staffManagerNextPage",
                		type : "post",
                		data : {
                			staffPageSize : pageSize,
                			staffCurPage : curPage
                		}});
                    displayPage();
                });
                $("#btn4").click(function lastPage(){    // 尾页
                    curPage=page;
                    direct = 0;
                    $.ajax({
                		url : "staffManagerLastPage",
                		type : "post",
                		data : {
                			staffPageSize : pageSize
                		}});
                    displayPage();
                });
                $("#btn5").click(function changePage(){    // 转页
                    curPage=document.getElementById("changePage").value * 1;
                    if (!/^[1-9]\d*$/.test(curPage)) {
                        alert("请输入正整数");
                        return ;
                    }
                    if (curPage > page) {
                        alert("超出数据页面");
                        return ;
                    }
                    $.ajax({
                		url : "staffManagerJumpPage",
                		type : "post",
                		data : {
                			staffPageSize : pageSize,
                			staffCurPage : curPage
                		},
                		success: function onSuccess() {
							
						}});
                    direct = 0;
                    displayPage();
                });

                
                $("#pageSizeSet").click(function setPageSize(){    // 设置每页显示多少条记录
                    pageSize = document.getElementById("pageSize").value;    //每页显示的记录条数
                    if (!/^[1-9]\d*$/.test(pageSize)) {
                        alert("请输入正整数");
                        return ;
                    }
                    len =$("#mytable tr").length - 1;
                    page=len % pageSize==0 ? len/pageSize : Math.floor(len/pageSize)+1;//根据记录条数，计算页数
                    curPage=1;        //当前页
                     direct=0;        //方向
                     firstPage();
                });
            });

            function displayPage(){
                if(curPage <=1 && direct==-1){
                    direct=0;
                    alert("已经是第一页了");
                    return;
                } else if (curPage >= page && direct==1) {
                    direct=0;
                    alert("已经是最后一页了");
                    return ;
                }

                lastPage = curPage;

                // 修复当len=1时，curPage计算得0的bug
                if (len > pageSize) {
                    curPage = ((curPage + direct + len) % len);
                } else {
                    curPage = 1;
                }

                
                document.getElementById("btn0").innerHTML="当前 " + curPage + "/" + page + " 页    每页 ";        // 显示当前多少页

                begin=(curPage-1)*pageSize + 1;// 起始记录号
                end = begin + 1*pageSize - 1;    // 末尾记录号

                
                if(end > len ) end=len;
                $("#mytable tr").hide();    // 首先，设置这行为隐藏
                $("#mytable tr").each(function(i){    // 然后，通过条件判断决定本行是否恢复显示
                    if((i>=begin && i<=end) || i==0 )//显示begin<=x<=end的记录
                        $(this).show();
                });

             }
</script>
	<script type="text/javascript">
<!--在操作栏里面的修改删除-->


(function() {
    $('#tablelist').bootstrapTable({
      url: "${ctxAdmin}/user/userData?orgId=${orgId}",
      search: true,  //是否显示搜索框功能
      pagination: true,  //是否分页
      showRefresh: true, //是否显示刷新功能 
      showToggle: true,
      showColumns: true,
      iconSize: 'outline',
     // toolbar: '#exampleTableEventsToolbar', 可以在table上方显示的一条工具栏，
      icons: {
        refresh: 'glyphicon-repeat',
        toggle: 'glyphicon-list-alt',
        columns: 'glyphicon-list'
      }
    });
    function loading() {
		var index = layer.load(1, {
			shade : [ 0.1, '#fff' ]
		//0.1透明度的白色背景
		});
		layer.msg('页面正在加载中,请稍后');
	}
</script>
</body>
</html>

